<script>
import { ref } from 'vue'
import axios from "axios";
import global from "@/views/global/global";
const value1 = ref('')
const value2 = ref('')
const defaultTime = new Date(2000, 1, 1, 12, 0, 0)

export default {
  name: "WaitingTask",
  //组件部件
  setup(){
    const dialogVisible1 = ref(false);
    const dialogVisible2 = ref(false);
    return {
      dialogVisible1,
      dialogVisible2,
    }
  },
  data(){
    return {
      checkedValue:'',//单选框
      titles_top : "待处理任务《请假处理》",
      user:global.user,
      pageDto:{
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto1:{ //出差
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto2:{ //收入
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto3:{ //用车
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto4:{ //用章
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto5:{ //图书
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      pageDto6:{ //名片
        pageSize:4,
        pageNum:1,
        data:{
          createdAt1:"",//开始时间
          createdAt2:"",//结束时间
          realName:"",
          reason:"", //原由
          borrowDate1:"",//借阅日期
          borrowDate2:"",//借阅日期
          bookName:"",//图书名称
          task:"",//工作任务
          applicationDate1:"",//申请日期
          applicationDate2:"",//申请日期
          applicationTime1:"",//申请时间
          applicationTime2:"",//申请时间
          remarks:"",// 备注信息

        }
      },
      announcementList:[],
      total:0,
      pages:0,
      WaitingTask:{},
      scores_1 : 0,
      //提示小红点
      span_but_1 : false,
      span_but_2 : true,
      span_but_3 : true,
      span_but_4 : true,
      span_but_5 : true,
      span_but_6 : true,
      span_but_7 : true,
      //table查询显示页面
      isoks1:true, //请假
      isoks2:false, //出差
      isoks3:false, //收入
      isoks4:false, //用车
      isoks5:false, //用章
      isoks6:false, //图书
      isoks7:false, //名片
      //分页查询获取数据声明存储变量
      queryLeaveApplicationsAndUsersList:[],//待处理任务-请假申请分页查询
      queryTravelApplicationsAndUsersList:[],//待处理任务-出差申请分页查询
      queryIncomeProofApplicationsAndUsersList:[],//待处理任务-收入证明申请分页查询
      queryVehicleUsageAndVehicleManagementAndUsersList:[],//待处理任务-用车申请分页查询
      querySealManagementList:[],//待处理任务-用章申请分页查询
      queryBookBorrowingList:[],//待处理任务-图书预约申请分页查询
      queryBusinessCardPrintingList:[],//待处理任务-名片打印申请分页查询

      //获取 红点待处理 个数
      scoreCount_1:"",//请假
      scoreCount_2:"",//出差
      scoreCount_3:"",//收入
      scoreCount_4:"",//用车
      scoreCount_5:"",//用章
      scoreCount_6:"",//图书
      scoreCount_7:"",//名片

      //根据id查看对应显示的修改信息
      LookUpdateLeaveApplicationsAndUsersList:{},//请假
      LookUpdateTravelApplicationsAndUsersList:{},//出差
      LookUpdateIncomeProofApplicationsAndUsersList:{},//收入
      LookUpdateVehicleUsageAndVehicleManagementAndUsers:{},//用车
      LookUpdateSealManagementList:{},//用章
      LookUpdateBookBorrowingList:{},//图书
      LookUpdateBusinessCardPrintingList:{},//名片
    }
  },created() {
    this.getData1();//待处理任务-请假申请分页查询
    this.getData2();//待处理任务-出差申请分页查询
    this.getData3();//待处理任务-收入证明申请分页查询
    this.getData4();//待处理任务-用车申请分页查询
    this.getData5();//待处理任务-用章申请分页查询
    this.getData6();//待处理任务-图书预约申请分页查询
    this.getData7();//待处理任务-名片打印申请分页查询

    this.getscoreCount_1();//请假——获取待处理个数
    this.getscoreCount_2();//出差——获取待处理个数
    this.getscoreCount_3();//收入——获取待处理个数
    this.getscoreCount_4();//用车——获取待处理个数
    this.getscoreCount_5();//用章——获取待处理个数
    this.getscoreCount_6();//图书——获取待处理个数
    this.getscoreCount_7();//名片——获取待处理个数

  },methods:{
    //根据id查看对应显示的修改信息
    //根据id查看对应显示的修改信息——请假
    getLookUpdateLeaveApplicationsAndUsersList(applicationId){
      this.dialogVisible2 = true
      axios.get(`/oa/desktop/LookUpdateLeaveApplicationsAndUsersList/${applicationId}`).then((data)=>{
        this.LookUpdateLeaveApplicationsAndUsersList = data.data
        console.log("获取根据id查看对应显示的修改信息——请假"+data.data)
        console.log(this.LookUpdateLeaveApplicationsAndUsersList)
      })
    },
    //审核 修改信息操作，传入需要进行修改的对象
    getLookUpdateLeaveApplicationsAndUsersLists(applicationId){
      this.dialogVisible1 = true
      axios.get(`/oa/desktop/LookUpdateLeaveApplicationsAndUsersList/${applicationId}`).then((data)=>{
        this.LookUpdateLeaveApplicationsAndUsersList = data.data
        console.log("获取根据id查看对应显示的修改信息——请假"+data.data)
        console.log(this.LookUpdateLeaveApplicationsAndUsersList)
      })
    },
    //确认审核信息——请假
    updateIsok_1(){
      this.LookUpdateLeaveApplicationsAndUsersList.approverId = this.user.id
      this.LookUpdateLeaveApplicationsAndUsersList.status = this.checkedValue
      axios.put(`/oa/desktop/UpdateStatusLeaveApplicationsAndUsersList`,this.LookUpdateLeaveApplicationsAndUsersList).then((data)=>{
        if(data.data.code === 1){
          this.dialogVisible1 = false
          this.getData1()
          this.$message({
            type: 'success',
            message: '审核成功!'
          });
        }else {
          alert("修改失败")
          this.dialogVisible1 = false
        }
      })
      console.log("确认审核信息——请假"+this.LookUpdateLeaveApplicationsAndUsersList)
    },




    //获取 红点待处理 个数
    //名片——获取待处理个数
    getscoreCount_7(){
      axios.get("/oa/desktop/countBusinessCar").then((data)=>{
        this.scoreCount_7 = data.data
        console.log("名片——获取待处理个数"+data)
        console.log(this.scoreCount_7)
      })
    },
    //图书——获取待处理个数
    getscoreCount_6(){
      axios.get("/oa/desktop/countBookBorrowing").then((data)=>{
        this.scoreCount_6 = data.data
        console.log("图书——获取待处理个数"+data)
        console.log(this.scoreCount_6)
      })
    },
    //用章——获取待处理个数
    getscoreCount_5(){
      axios.get("/oa/desktop/countSealManagement").then((data)=>{
        this.scoreCount_5 = data.data
        console.log("用章——获取待处理个数"+data)
        console.log(this.scoreCount_5)
      })
    },
    //用车——获取待处理个数
    getscoreCount_4(){
      axios.get("/oa/desktop/countVehicleUsageAndVehicle").then((data)=>{
        this.scoreCount_4 = data.data
        console.log("用车——获取待处理个数"+data)
        console.log(this.scoreCount_4)
      })
    },
    //收入——获取待处理个数
    getscoreCount_3(){
      axios.get("/oa/desktop/countIncomeProof").then((data)=>{
        this.scoreCount_3 = data.data
        console.log("收入——获取待处理个数"+data)
        console.log(this.scoreCount_3)
      })
    },
    //出差——获取待处理个数
    getscoreCount_2(){
      axios.get("/oa/desktop/countT").then((data)=>{
        this.scoreCount_2 = data.data
        console.log("出差——获取待处理个数"+data)
        console.log(this.scoreCount_2)
      })
    },
    //请假——获取待处理个数
    getscoreCount_1(){
      axios.get("/oa/desktop/countLeave").then((data)=>{
        this.scoreCount_1 = data.data
        console.log("请假——获取待处理个数"+data)
        console.log(this.scoreCount_1)
      })
    },




    //待处理任务-名片打印申请分页查询
    getData7:function (){
      if (this.pageDto6.data.applicationTime1 != null &&  this.pageDto6.data.applicationTime1 !== ''){
        this.dateFormat(this.pageDto6.data.applicationTime1)
      }
      if (this.pageDto6.data.applicationTime2 != null &&  this.pageDto6.data.applicationTime2 !== ''){
        this.dateFormat(this.pageDto6.data.applicationTime2)
      }
      axios.post("/oa/desktop/queryBusinessCardPrintingList",this.pageDto6).then((res)=>{
        this.pageDto6.pageNum=res.data.data.pageNum;
        this.pageDto6.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryBusinessCardPrintingList=res.data.data.list;
        console.log("获取名片打印申请分页查询"+this.queryBusinessCardPrintingList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-图书预约申请分页查询
    getData6:function (){
      if (this.pageDto5.data.borrowDate1 != null &&  this.pageDto5.data.borrowDate1 !== ''){
        this.dateFormat(this.pageDto5.data.borrowDate1)
      }
      if (this.pageDto5.data.borrowDate2 != null &&  this.pageDto5.data.borrowDate2 !== ''){
        this.dateFormat(this.pageDto5.data.borrowDate2)
      }
      axios.post("/oa/desktop/queryBookBorrowingList",this.pageDto5).then((res)=>{
        this.pageDto5.pageNum=res.data.data.pageNum;
        this.pageDto5.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryBookBorrowingList=res.data.data.list;
        console.log("获取图书预约申请分页查询"+this.queryBookBorrowingList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-用章申请分页查询
    getData5:function(){
      if (this.pageDto4.data.applicationDate1 != null &&  this.pageDto4.data.applicationDate1 !== ''){
        this.dateFormat(this.pageDto4.data.applicationDate1)
      }
      if (this.pageDto4.data.applicationDate2 != null &&  this.pageDto4.data.applicationDate2 !== ''){
        this.dateFormat(this.pageDto4.data.applicationDate2)
      }
      axios.post("/oa/desktop/querySealManagementList",this.pageDto4).then((res)=>{
        this.pageDto4.pageNum=res.data.data.pageNum;
        this.pageDto4.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.querySealManagementList=res.data.data.list;
        console.log("获取用章申请分页查询"+this.querySealManagementList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-用车申请分页查询
    getData4:function (){
      if (this.pageDto3.data.createdAt1 != null &&  this.pageDto3.data.createdAt1 !== ''){
        this.dateFormat(this.pageDto3.data.createdAt1)
      }
      if (this.pageDto3.data.createdAt2 != null &&  this.pageDto3.data.createdAt2 !== ''){
        this.dateFormat(this.pageDto3.data.createdAt2)
      }
      axios.post("/oa/desktop/queryVehicleUsageAndVehicleManagementAndUsersList",this.pageDto3).then((res)=>{
        this.pageDto3.pageNum=res.data.data.pageNum;
        this.pageDto3.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryVehicleUsageAndVehicleManagementAndUsersList=res.data.data.list;
        console.log("获取用车申请分页查询"+this.queryVehicleUsageAndVehicleManagementAndUsersList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-收入证明申请分页查询
    getData3:function (){
      if (this.pageDto2.data.createdAt1 != null &&  this.pageDto2.data.createdAt1 !== ''){
        this.dateFormat(this.pageDto2.data.createdAt1)
      }
      if (this.pageDto2.data.createdAt2 != null &&  this.pageDto2.data.createdAt2 !== ''){
        this.dateFormat(this.pageDto2.data.createdAt2)
      }
      axios.post("/oa/desktop/queryIncomeProofApplicationsAndUsersList",this.pageDto2).then((res)=>{
        this.pageDto2.pageNum=res.data.data.pageNum;
        this.pageDto2.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryIncomeProofApplicationsAndUsersList=res.data.data.list;
        console.log("获取收入证明申请分页查询"+this.queryIncomeProofApplicationsAndUsersList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-出差申请分页查询
    getData2:function (){
      if (this.pageDto1.data.createdAt1 != null &&  this.pageDto1.data.createdAt1 !== ''){
        this.dateFormat(this.pageDto1.data.createdAt1)
      }
      if (this.pageDto1.data.createdAt2 != null &&  this.pageDto1.data.createdAt2 !== ''){
        this.dateFormat(this.pageDto1.data.createdAt2)
      }
      axios.post("/oa/desktop/queryTravelApplicationsAndUsersList",this.pageDto1).then((res)=>{
        this.pageDto1.pageNum=res.data.data.pageNum;
        this.pageDto1.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryTravelApplicationsAndUsersList=res.data.data.list;
        console.log("获取出差申请分页查询"+this.queryTravelApplicationsAndUsersList)
        console.log(res.data.data.list)
      })
    },
    //待处理任务-请假申请分页查询
    getData1:function(){
      if (this.pageDto.data.createdAt1 != null &&  this.pageDto.data.createdAt1 !== ''){
        this.dateFormat(this.pageDto.data.createdAt1)
      }
      if (this.pageDto.data.createdAt2 != null &&  this.pageDto.data.createdAt2 !== ''){
        this.dateFormat(this.pageDto.data.createdAt2)
      }
      console.log("时间获取参数1"+this.pageDto.data.createdAt1+"++++"+this.pageDto.data.createdAt2)
      axios.post("/oa/desktop/queryLeaveApplicationsAndUsersList",this.pageDto).then((res)=>{
        this.pageDto.pageNum=res.data.data.pageNum;
        this.pageDto.pageSize = res.data.data.pageSize;
        this.total=res.data.data.total;
        this.pages=res.data.data.pages;
        this.queryLeaveApplicationsAndUsersList=res.data.data.list;
        console.log("获取请假申请分页查询"+this.queryLeaveApplicationsAndUsersList)
        console.log(res.data.data.list)
      })
    },




    but_1(){ //请假
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《请假处理》"
      this.$router.push("/WaitingTaskView")
      this.span_but_1 = false
      this.span_but_2 = true
      this.span_but_3 = true
      this.span_but_4 = true
      this.span_but_5 = true
      this.span_but_6 = true
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = true
      this.isoks2 = false
      this.isoks3 = false
      this.isoks4 = false
      this.isoks5 = false
      this.isoks6 = false
      this.isoks7 = false

    },
    but_2(){ //出差
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《出差申请》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = false
      this.span_but_1 = true
      this.span_but_3 = true
      this.span_but_4 = true
      this.span_but_5 = true
      this.span_but_6 = true
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = true
      this.isoks3 = false
      this.isoks4 = false
      this.isoks5 = false
      this.isoks6 = false
      this.isoks7 = false
    },
    but_3(){ //收入
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《收入证明流程》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = true
      this.span_but_1 = true
      this.span_but_3 = false
      this.span_but_4 = true
      this.span_but_5 = true
      this.span_but_6 = true
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = false
      this.isoks3 = true
      this.isoks4 = false
      this.isoks5 = false
      this.isoks6 = false
      this.isoks7 = false
    },
    but_4(){ //用车
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《用车申请》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = true
      this.span_but_1 = true
      this.span_but_3 = true
      this.span_but_4 = false
      this.span_but_5 = true
      this.span_but_6 = true
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = false
      this.isoks3 = false
      this.isoks4 = true
      this.isoks5 = false
      this.isoks6 = false
      this.isoks7 = false
    },
    but_5(){ //用章
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《用章申请》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = true
      this.span_but_1 = true
      this.span_but_3 = true
      this.span_but_4 = true
      this.span_but_5 = false
      this.span_but_6 = true
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = false
      this.isoks3 = false
      this.isoks4 = false
      this.isoks5 = true
      this.isoks6 = false
      this.isoks7 = false

    },
    but_6(){ //图书
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《图书借阅申请》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = true
      this.span_but_1 = true
      this.span_but_3 = true
      this.span_but_4 = true
      this.span_but_5 = true
      this.span_but_6 = false
      this.span_but_7 = true
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = false
      this.isoks3 = false
      this.isoks4 = false
      this.isoks5 = false
      this.isoks6 = true
      this.isoks7 = false
    },
    but_7(){ //名片
      this.titles_top = "待处理任务"
      this.titles_top = this.titles_top + "《名片印制流程》"
      this.$router.push("/WaitingTaskView")
      this.span_but_2 = true
      this.span_but_1 = true
      this.span_but_3 = true
      this.span_but_4 = true
      this.span_but_5 = true
      this.span_but_6 = true
      this.span_but_7 = false
      //table查询显示页面
      this.isoks1 = false
      this.isoks2 = false
      this.isoks3 = false
      this.isoks4 = false
      this.isoks5 = false
      this.isoks6 = false
      this.isoks7 = true
    },
    //日期转换
    dateFormat(time) {
      var date = new Date(time);
      var year = date.getFullYear();
      /* 在日期格式中，月份是从0开始的，因此要加0
      * 使用三元表达式在小于10的前面加0，以达到格式统一 如 09:11:05
      * */
      var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
      var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
      var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
      var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
      // 拼接
      return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
      // return year + "-" + month + "-" + day;
    },
  }
}
</script>

<template>

<!--标头显示-->
  <div  class="titleBox">
    <router-link :to="'/HomePageView'">
      <el-button class="titleLeft" plain style="
      border: none;
      font-weight: bold;
      text-align: left;
      float: left;
      margin: 5px 0 0 0 ">
        <&nbsp;&nbsp;&nbsp;&nbsp;桌面
      </el-button>
    </router-link>
    {{ titles_top }}
  </div>

  <div>
<!--    切换部分-->
    <div style="height: 40px;line-height: 40px;border-bottom: silver 1px solid;padding-bottom: 10px">
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_1()">请假</el-button><span v-show="span_but_1" class="span_but" v-if="this.scoreCount_1 > 0">{{scoreCount_1}}</span>
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_2()">出差</el-button><span v-show="span_but_2" class="span_but" v-if="this.scoreCount_2 > 0">{{scoreCount_2}}</span>
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_3()">收入</el-button><span v-show="span_but_3" class="span_but" v-if="this.scoreCount_3 > 0">{{scoreCount_3}}</span>
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_4()">用车</el-button><span v-show="span_but_4" class="span_but" v-if="this.scoreCount_4 > 0">{{scoreCount_4}}</span>
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_5()">用章</el-button><span v-show="span_but_5" class="span_but" v-if="this.scoreCount_5 > 0">{{scoreCount_5}}</span>
      <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_6()">图书</el-button><span v-show="span_but_6" class="span_but" v-if="this.scoreCount_6 > 0">{{scoreCount_6}}</span>
        <el-button style="width: 110px;margin: 0 5px 0 5px;" @click="but_7()">名片</el-button><span v-show="span_but_7" class="span_but" v-if="this.scoreCount_7 > 0">{{scoreCount_7}}</span>
    </div>

    <!--  请假  -->
    <div v-if="isoks1">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>原由：</label>
        <el-input
            v-model="this.pageDto.data.reason"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入原由"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto.data.createdAt1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto.data.createdAt2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData1" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryLeaveApplicationsAndUsersList" style="width: 100%" >

          <el-table-column label="名称原由">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.realName}}{{scope.row.reason}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.createdAt }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.realName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.endDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved' || scope.row.status === '批准'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending' || scope.row.status === '待处理'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected' || scope.row.status === '驳回'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作">
            <template #default="scope">
              <el-button @click="getLookUpdateLeaveApplicationsAndUsersList(scope.row.applicationId)" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="getLookUpdateLeaveApplicationsAndUsersLists(scope.row.applicationId)" v-if="scope.row.status === '待处理' || scope.row.status === 'pending'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto.pageNum"
            :page-size="this.pageDto.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData1"
        />
      </div>
    </div>


    <!--  出差  -->
    <div v-if="isoks2">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>工作任务：</label>
        <el-input
            v-model="this.pageDto1.data.task"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入工作任务"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto1.data.createdAt1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto1.data.createdAt2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData2" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryTravelApplicationsAndUsersList" style="width: 100%" >

          <el-table-column label="工作任务">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.realName}}{{scope.row.reason}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.createdAt }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.realName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="地点">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.location }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.endDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == 'pending'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto1.pageNum"
            :page-size="this.pageDto1.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData2"
        />
      </div>
    </div>

    <!--  收入  -->
    <div v-if="isoks3">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>申请原因：</label>
        <el-input
            v-model="this.pageDto2.data.reason"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入申请原因"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto2.data.createdAt1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto2.data.createdAt2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData3" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryIncomeProofApplicationsAndUsersList" style="width: 100%" >

          <el-table-column label="申请原因">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.realName}}{{scope.row.reason}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicationDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.realName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="岗位">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.position }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.createdAt }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == 'pending'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto2.pageNum"
            :page-size="this.pageDto2.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData3"
        />
      </div>
    </div>

    <!--  用车  -->
    <div v-if="isoks4">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>用车原由：</label>
        <el-input
            v-model="this.pageDto3.data.reason"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入用车原由"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto3.data.createdAt1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto3.data.createdAt2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData4" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryVehicleUsageAndVehicleManagementAndUsersList" style="width: 100%" >

          <el-table-column label="用车原由">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.realName}}{{scope.row.reason}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.createdAt }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.realName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="目的地">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.destination }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="车辆信息">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.vehicleType }}{{scope.row.vehicleNumber}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.endTime }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'APPROVED'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'PENDING'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'REJECTED'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作" width="150px">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == 'PENDING'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto3.pageNum"
            :page-size="this.pageDto3.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData4"
        />
      </div>
    </div>


    <!--  用章  -->
    <div v-if="isoks5">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>申请原因：</label>
        <el-input
            v-model="this.pageDto4.data.reason"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入申请原因"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto4.data.applicationDate1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto4.data.applicationDate2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData5" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.querySealManagementList" style="width: 100%" >

          <el-table-column label="申请原因">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.reason}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicationDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="发起人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicantName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="部门">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.department }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="印章名">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.sealName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.approvalDate === null || scope.row.approvalDate == ''">无</span>
                <span style="margin-left: 10px" v-if="scope.row.approvalDate !== null || scope.row.approvalDate !== ''">{{ scope.row.approvalDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作" width="130px">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == '待处理' || scope.row.status === 'approved'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto4.pageNum"
            :page-size="this.pageDto4.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData5"
        />
      </div>
    </div>

    <!--  图书  -->
    <div v-if="isoks6">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>图书名称：</label>
        <el-input
            v-model="this.pageDto5.data.bookName"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入图书名称"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto5.data.borrowDate1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto5.data.borrowDate2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData6" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryBookBorrowingList" style="width: 100%" >

          <el-table-column label="图书名称">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.bookName}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="借阅日期">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.borrowDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="借阅人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.borrower }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="借阅部门">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.borrowerDepartment }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.approvalDate === null || scope.row.approvalDate == ''">无</span>
                <span style="margin-left: 10px" v-if="scope.row.approvalDate !== null || scope.row.approvalDate !== ''">{{ scope.row.approvalDate }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == 'pending'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto5.pageNum"
            :page-size="this.pageDto5.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData6"
        />
      </div>
    </div>

    <!--  名片  -->
    <div v-if="isoks7">
      <!--  搜索部分-->
      <div style="margin-bottom: 10px;margin: 10px 0 10px 0">
        <label>备注信息：</label>
        <el-input
            v-model="this.pageDto6.data.remarks"
            style="max-width: 150px;margin: 0 10px 0 10px"
            placeholder="请输入备注信息"
        >
        </el-input>

        <span class="demonstration">发起时间：</span>
        <el-date-picker
            v-model="this.pageDto6.data.applicationTime1"
            type="datetime"
            placeholder="起始时间"
        />
        <span class="demonstration">&nbsp;&nbsp;To&nbsp;&nbsp;</span>
        <el-date-picker
            v-model="this.pageDto6.data.applicationTime2"
            type="datetime"
            placeholder="结束时间"
        />

        <el-button @click="getData7" style="margin-left: 10px">搜索</el-button>
      </div>

      <div>
        <!-- 首页表格信息显示 -->
        <el-table :data="this.queryBusinessCardPrintingList" style="width: 100%" >

          <el-table-column label="备注信息">
            <template #default="scope">
              <div style="display: flex; align-items: center">

                <span style="margin-left: 10px">{{ scope.row.remarks}}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="申请时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicationTime }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="申请人">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicantName }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="部门">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicantDepartment }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="职位">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px">{{ scope.row.applicantPosition }}</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="最后审批时间">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.approvalDate === null || scope.row.approvalDate == ''">无</span>
                <span style="margin-left: 10px" v-if="scope.row.approvalDate !== null || scope.row.approvalDate !== ''">{{ scope.row.approvalDate }}</span>

              </div>
            </template>
          </el-table-column>

          <el-table-column label="状态">
            <template #default="scope">
              <div style="display: flex; align-items: center">
                <span style="margin-left: 10px" v-if="scope.row.status === 'approved'">批准</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'pending'">待处理</span>
                <span style="margin-left: 10px" v-if="scope.row.status === 'rejected'">驳回</span>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="操作" width="130px">
            <template #default="scope">
              <el-button @click="dialogVisible2 = true" size="small" type="danger" style="margin-right: 10px">
                查看
              </el-button>

              <el-link @click="dialogVisible1 = true" v-if="scope.row.status == 'pending'" >
                <el-button size="small">
                  审核
                </el-button>
              </el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页-->
        <el-pagination
            v-model:current-page="this.pageDto6.pageNum"
            :page-size="this.pageDto6.pageSize"
            :pager-count="10"
            layout="prev, pager, next"
            :total="this.total"
            @current-change="getData7"
        />
      </div>
    </div>


  </div>

<!--  审核 界面-->
  <el-dialog
      v-model="dialogVisible1"
      title="审核"
      width="600"
      :before-close="handleClose"
  >
    <div class="tops" style="border-bottom: darkgray 1px solid;height: 200px">
      <div class="tops_left">
        <p>姓名：<span>{{LookUpdateLeaveApplicationsAndUsersList.realName}}</span></p>
        <p>开始时间：<span>{{LookUpdateLeaveApplicationsAndUsersList.startDate}}</span></p>
        <p>请假天数：<span>{{LookUpdateLeaveApplicationsAndUsersList.leaveDays}}</span>（天）</p>
        <p>请假理由：<span>{{LookUpdateLeaveApplicationsAndUsersList.reason}}</span></p>
        <h3>操作</h3>
      </div>
      <div class="tops_right">
        <p>部门：<span>{{ LookUpdateLeaveApplicationsAndUsersList.title }}</span></p>
        <p style="margin-top: 50px">结束时间：<span>{{LookUpdateLeaveApplicationsAndUsersList.endDate}}</span></p>
        <p>请假类型：<span>{{LookUpdateLeaveApplicationsAndUsersList.leaveType}}</span></p>
      </div>
    </div>

    <div class="buts" style="height: 210px;overflow-y: scroll; scrollbar-width: thin;  scrollbar-color: darkgray transparent;">
      <div class="buts_left"  style="margin-top: 20px">
          <el-form
            style="width: 500px;margin: 0 auto"
            :model="LookUpdateLeaveApplicationsAndUsersList"
            label-width="auto"
            class="demo-ruleForm"
        >
          <el-form-item label="审批意见：" prop="userCord">
            <el-input
                type="textarea"
                autocomplete="off"
                aria-required="true"
            />
          </el-form-item>

          <el-form-item label="操作人：" prop="userCord" aria-readonly="true">
            <el-input
                v-model="this.user.realName"
                type="text"
                autocomplete="off"
                aria-required="true"
                readonly
            />
          </el-form-item>


          <p>
            <input type="radio"
                   v-model="checkedValue"
                   value="approved"
                   name="iso">
            <span style="margin-left: 10px">审核通过</span>
            <br>
            <br>
            <input type="radio"
                   v-model="checkedValue"
                   value="rejected"
                   name="iso">
            <span style="margin-left: 10px">驳回</span>
          </p>
          </el-form>

      </div>
    </div>

    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="updateIsok_1">
          保存
        </el-button>
      </div>
    </template>
  </el-dialog>



  <!--  查看 界面-->
  <el-dialog
      v-model="dialogVisible2"
      title="任务明细"
      width="600"
      :before-close="handleClose"
  >
    <div style="width: 570px;">
      <div class="tops" style="border-bottom: darkgray 1px solid">
        <div class="tops_left">
        <p>姓名：<span>{{LookUpdateLeaveApplicationsAndUsersList.realName}}</span></p>
        <h3>详细</h3>
        <p>开始时间：<span>{{LookUpdateLeaveApplicationsAndUsersList.startDate}}</span></p>
        <p>请假天数：<span>{{LookUpdateLeaveApplicationsAndUsersList.leaveDays}}</span>（天）</p>
        <p>请假理由：<span>{{LookUpdateLeaveApplicationsAndUsersList.reason}}</span></p>
        <h3>审批信息</h3>
        </div>
        <div class="tops_right">
          <p>部门：<span>{{ LookUpdateLeaveApplicationsAndUsersList.title }}</span></p>
          <p style="margin-top: 56px">结束时间：<span>{{LookUpdateLeaveApplicationsAndUsersList.endDate}}</span></p>
          <p>请假类型：<span>{{LookUpdateLeaveApplicationsAndUsersList.leaveType}}</span></p>
        </div>
      </div>

      <div class="buts">
        <div class="buts_left">
          <h3>前台记录</h3>
          <p>审批人：<span>... ...</span></p>
          <p>审批信息：<span>... ...</span></p>
          <h3>薪酬专员记录</h3>
          <p>审批人：<span>... ...</span></p>
          <p>审批时间：<span>... ...</span></p>
          <h3>部门经理审批</h3>
          <p>审批人：<span>******</span></p>
          <p>审批结果：
            <span style="color: darkred" v-if="LookUpdateLeaveApplicationsAndUsersList.status === '待处理' || LookUpdateLeaveApplicationsAndUsersList.status === 'pending' ">待处理</span>
            <span style="color: #42b983" v-if="LookUpdateLeaveApplicationsAndUsersList.status === '批准' || LookUpdateLeaveApplicationsAndUsersList.status === 'approved' ">批准</span>
            <span style="color: darkred" v-if="LookUpdateLeaveApplicationsAndUsersList.status === '驳回' || LookUpdateLeaveApplicationsAndUsersList.status === 'rejected' ">驳回</span>
          </p>
        </div>

        <div class="buts_right">
          <p style="margin-top: 56px">审批时间：<span>... ...</span></p>
          <p style="margin-top: 92px">审批结果：<span>... ...</span></p>
          <p>审批信息：<span>... ...</span></p>
          <p style="margin-top: 55px">审批时间：<span>{{LookUpdateLeaveApplicationsAndUsersList.createdAt}}</span></p>
        </div>
      </div>

    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogVisible2 = false">取消</el-button>
      </div>
    </template>

  </el-dialog>


</template>

<style scoped lang="less">
.tops{
  width: 570px;
  height: 235px
}
.tops .tops_left,.tops_right{
  text-align: left;
  width: 275px;
  display: inline-block;
  float: left;
}
.buts{
  width: 570px;
  height: 310px
}
.buts .buts_left,.buts_right{
  text-align: left;
  width: 275px;
  display: inline-block;
  float: left;
}
div{
  //border: #42b983 1px solid;
}
.el-textarea__inner,.el-textarea{
  --width: 400px;
}
.span_but{
  display: inline-block;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  background-color: red;
  color: honeydew;
  border-radius: 10px;
  position: relative;
  top: -4px;
  left: -20px;
}

</style>
